<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<title>欢迎您登录{:C('WEB_SITE_NAME')}管理平台</title>
		<!-- Tell the browser to be responsive to screen width -->
		<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
		<!-- Bootstrap 3.3.6 -->
		<link rel="stylesheet" href="/Kcdns/Public/Admin/plugins/bootstrap/css/bootstrap.min.css">
		<!-- Theme style -->
		<link rel="stylesheet" href="/Kcdns/Public/Admin/css/AdminLTE.min.css">
		<link rel="stylesheet" href="/Kcdns/Public/Admin/css/AdminLTE.extend.css">

		<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
		<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
		<!--[if lt IE 9]>
	  	<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
	  	<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
	  	<![endif]-->
		<style>
			html,body{height: 100%;}
			input:-webkit-autofill {
				-webkit-box-shadow: 0 0 0px 1000px white inset;
			}
			.form-control{line-height: 40px;height:40px;border:none;}
			.form-group{position:relative;margin-bottom: 0;border-bottom: 1px solid #dbdbdb;}
			.btn.btn-flat{height: 40px;}
			.login-logo{color:#ffffff;}
			.login-box-body .form-control-feedback, .register-box-body .form-control-feedback{line-height: 40px;}
			.btn-primary:hover{border-color: #367fa9;};
		</style>
		<script>
				//预加载背景图片
				function loadImage(url, callback) {
						var startTime = new Date().getTime()
						var img = new Image();
						img.src = url;
						img.onload = function(){ //图片下载完毕时异步调用callback函数。
								callback.call(img,startTime); // 将callback函数this指针切换为img。
						};
				}

				function imgLoaded(time1){
						var time2 = new Date().getTime();
						var bgImg = document.querySelector(".login-bgImg");
						var timer;
						var o = 0;
						console.log(time2-time1);
						timer = setInterval(function(){
								bgImg.style.opacity = o*0.01;
								if(o >= 100){
										clearInterval(timer);
								}
								o += 10;

						},50);
				}

				loadImage('/Kcdns/Public/Admin/img/login/loginBg2.png',imgLoaded);
		</script>
	</head>
	<body class="hold-transition login-page">

		<div class="login-box">
			<div class="login-bgImg"><img src="/Kcdns/Public/Admin/img/login/loginBg2.png"></div>
			<div class="login-box-body">
				<div class="login-logo"> <!-- hidden-xs -->
						<div class="login-avatar"></div>
						<!-- <if condition="C('WEB_LOGO')">
                <img src="{:get_cover(C('WEB_LOGO'),'path')}" alt="网站后台登陆">
            <else />
                <b>{:C('WEB_SITE_NAME')}</b><span>管理平台</span>
            </if> -->
				</div>
				<form action="{:U('login')}" method="post" id="login-form">
					<div class="form-group">
						<input type="type" class="form-control" name="username" placeholder="用户名" autocomplete="off">
					</div>
					<div class="form-group">
						<input type="password" class="form-control" name="password" placeholder="密　码" autocomplete="off">
					</div>
					<?php
						if(defined('APP_DEBUG') && APP_DEBUG === false) :
					?>
                    <div class="form-group verifycode">
                        <input type="text" class="form-control" name="verify" placeholder="验证码" autocomplete="off">
                        <img class="verifyimg reloadverify" alt="点击切换" src="{:U('Public/verify')}">
                    </div>
					<?php endif;?>
					<div class="row" style="margin-top: 20px;">

						<div class="col-xs-12">
							<button type="submit" class="btn btn-primary btn-block btn-flat btn-login">
								<span class="sr-only"><i class="icon-loading"></i>登 录 中 ...</span>
                                <span class="on">后台登录</span>
							</button>
							<div class="check-tips"></div>
						</div>

					</div>
				</form>
			</div>
		</div>
		<script type="text/javascript" src="/Kcdns/Public/Admin/plugins/jQuery/jquery-2.2.3.min.js"></script>
		<?php echo O('util')->postToken();?>
	    <!-- Bootstrap 3.3.6 -->
		<script src="/Kcdns/Public/Admin/plugins/bootstrap/js/bootstrap.min.js"></script>
		<!-- validate 1.15.0 -->
		<script src="/Kcdns/Public/Admin/plugins/jquery-validation/jquery.validate.min.js"></script>
		<script src="/Kcdns/Public/Admin/plugins/jquery-validation/localization/messages_zh.min.js"></script>
		<script src="/Kcdns/Public/Admin/plugins/iCheck/icheck.min.js"></script>
    	<!-- AdminLTE App -->
		<script src="/Kcdns/Public/Admin/js/app.js"></script>

		<script type="text/javascript">
			/*$(function(){
				//表单验证
				var rules = {
					"username":{
						required: true,
						minlength: 5
					},
					"password":{
						required: true,
						minlength: 5
					},
					"verify":{
						required: true,
						rangelength : [4,4]
					}

				};
				var message = {
				      "username": {
				        required: "请输入用户名",
				        minlength: "用户名长度不能小于 5 个字母"
				      },
				      "password": {
				        required: "请输入密码",
				        minlength: "密码长度不能小于 5 个字母"
				      }
				};
				$.AdminLTE.formCheck.valid("#login-form",rules,message,{
					'errorElement': 'span',
					'submitHandler': formSubmitHandler
				});
			})*/





	    	//表单提交
	    	$(document)
		    	.ajaxStart(function(){
		    		$("button:submit").addClass("log-in").attr("disabled", true)
		    		.children("span:eq(0)").removeClass("sr-only").end()
		    		.children("span:eq(1)").addClass("sr-only");
		    	})
		    	.ajaxStop(function(){
		    		$("button:submit").removeClass("log-in").attr("disabled", false)
		    		.children("span:eq(0)").addClass("sr-only").end()
		    		.children("span:eq(1)").removeClass("sr-only");
		    	});

			$("form").submit(function(){
				var self = $("#login-form");
		    		$.post(self.attr("action"), self.serialize(), success, "json");
		    		return false;

		    		function success(data){
		    			if(data.status){
		    				window.location.href = data.url;
		    			} else {
		    				var text = "<i class='glyphicon glyphicon-warning-sign'></i>&nbsp;&nbsp;" + data.info;
								console.log();
								if(data.info.indexOf("验证码") == -1){
										$("#login-form").find("input[name=username]").focus();
								}else{
										$("#login-form").find("input[name=verify]").focus();
								}
		    				self.find(".check-tips").html(text).show();
		    				if(!$(".check-tips").is(":hidden")){
					    		setTimeout(function(){
					    			$(".check-tips").hide();
					    		},5000)
					    	}
		    				//刷新验证码
		    				$(".reloadverify").click();
		    			}
		    		}
			})

			//}


			$(function(){
				//初始化选中用户名输入框
				$("#login-form").find("input[name=username]").focus();
				//刷新验证码
				var verifyimg = $(".verifyimg").attr("src");
	            $(".reloadverify").click(function(){
	                if( verifyimg.indexOf('?')>0){
	                    $(".verifyimg").attr("src", verifyimg+'&random='+Math.random());
	                }else{
	                    $(".verifyimg").attr("src", verifyimg.replace(/\?.*$/,'')+'?'+Math.random());
	                }
	            });



			});
	    </script>
	</body>
</html>
